<template>
    <div class="container">
        <img :src="endPageImg">
        <img :src="restartBtn" :style="btnStyle" @click='restart' class="btn">
    </div>
</template>

<script>
import endPageImg from '../assets/end_page.jpg'
import restartBtn from '../assets/restartBtn.png'
import { useRouter } from 'vue-router'
export default {
    name: 'EndPage',
    setup() {
        const btnStyle = {
            position: 'absolute',
            top: '47%',
            left: '30%'
        }

        const router = useRouter()
        function restart() {
            router.push('/game')
        }
        return { endPageImg, restartBtn, btnStyle, restart }
    }
}
</script>
<style lang="stylus" scoped>
.container
  width 100%
  background pink
  img
    width 100%
  .btn
    width 43%
</style>